<template>
	<view class="djs">
		<scroll-view scroll-y="true" @scrolltolower="fetchData"
			style="height: 64vh;padding: 10rpx;box-sizing: border-box;">
			<view class="information-data" v-for="(val,inx) in storeInformation" :key="inx">
				<view class="data-itm">
					<view class="itm-inst">
						<image
							src="http://static.qlzc.net/1895408479469047808/material/ebce87d1-584f-4167-be8f-1e0b917eada4.png"
							mode="" style="width: 50rpx; height: 50rpx;"></image>
						<span style="margin-left: 20rpx;">{{val.id}}</span>
					</view>
					<view class="itm-type">
						{{val.type}}
					</view>
				</view>
				<view class="data-itm">
					<view class="">
						录入时间:{{val.createdTime}}
					</view>
				</view>
				<view class="data-value">
					<view class="val-li">
						<span class="li-number">8</span>
						<span>使用次数</span>
					</view>
					<view class="val-li">
						<span class="li-number">18</span>
						<span>剩余次数</span>
					</view>
				</view>
			</view>
		</scroll-view>
		<yes-js-table-vue v-if="yesShow" :mdata="confirmdata" @change="modeShowchange"></yes-js-table-vue>
	</view>
</template>

<script>
	import {
		nextTick
	} from "vue";

	
	export default {
		components: {
		
		},
		data() {
			return {
				page: 1,
				pageSize: 10,
				loading: false,
				hasMore: true,
				yesShow: false,
				storeInformation: [{
					id: 'KO12332',
					password: '123456',
					createdTime: '2025-05-20 12:00:00',
					type: 123456
				}],
				confirmdata: {}
			}
		},
		mounted() {
			console.log(111);
			setTimeout(() => {
				// 确保 DOM 更新后再执行操作
				this.$nextTick(() => {
					// this.install()
				});
			}, 1000);

			// nextTick()

		},
		methods: {
			async fetchData(page, pageSize) {
				// 这里替换为实际的API请求
				if (this.loading || !this.hasMore) return;
				this.loading = true;
				try {
					// await lotteryrolloutmergerecordingPage({
					// 	current: this.page,
					// 	size: this.pageSize,
					// 	status: 0
					// }).then(res => {
					// 	console.log(res.data.records);
					// 	if (res.data.records.length > 0) {
					// 		this.storeInformation = this.storeInformation.concat(res.data.records);
					// 		this.page++;
					// 	} else {
					// 		this.hasMore = false;
					// 	}
					// }).catch(error => {
					// 	console.error('请求出错:', error);
					// });
					// console.log(11111);

				} catch (error) {
					console.error('加载数据失败', error);
				} finally {
					this.loading = false;
				}
			},
			install() {
				this.page = 1
				this.pageSize = 10
				lotteryrolloutmergerecordingPage({
					current: this.page,
					size: this.pageSize,
					status: 0
				}).then(res => {
					console.log(res.data.records);
					this.storeInformation = res.data.records;

				})
			},
			confirm(val) {
				this.confirmdata = val
				this.yesShow = true
				console.log(val);
			},
			//拒绝
			errconfirm(val) {
				let that = this
				let data = {
					rollOutUserId: val.rollOutUserId,
					uniqueCode: '1111',
					id: val.id,
					status: 2,
				}
				lotteryrolloutmergerecordingAuditData(data).then(res => {
					console.log(res);
					if (res.code == 0) {
						uni.showToast({
							title: '已拒绝',
							//将值设置为 success 或者直接不用写icon这个参数
							icon: 'success',
							//显示持续时间为 2秒
							duration: 2000
						})
						that.install()
					}
				})
				console.log(this.content, this.yzmid);

			},
			modeShowchange() {
				this.yesShow = false
				this.install()
			}
		}
	}
</script>

<style lang="scss" scoped>
	.djs {
		width: 100%;
		height: 100%;
		// background-color: #fff;
	}

	.information-data {
		width: 100%;
		height: 260rpx;
		background-color: #fff;
		margin-top: 15rpx;
		padding: 10rpx;
		box-sizing: border-box;
		// display: flex;
		// justify-content: space-between;
	}

	.data-itm {
		width: 100%;
		height: 60rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.itm-inst{
		flex:1;
		height: 100%;
		display: flex;
		align-items: center;
	}
	.itm-type{
		width: 350rpx;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		// background-color: #f50;
	}
	.type-btn{
		width: 120rpx;
		height: 50rpx;
		background-color: rgba(204, 204, 204, 1);
		color:rgba(102, 102, 102, 1);
		font-weight: bolder;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 10rpx;
	}
	.data-value{
		width: 100%;
		height: 140rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.val-li{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.li-number{
		margin-bottom: 10rpx;
		font-size: 1.1rem;
		color:#f00;
		font-weight: bolder;
	}
</style>